<template>
	<view class="container">
		<login v-if="!isLogined"  v-on:plogin="loginSuccess()"></login>
		<!-- 商品详情 - start -->
		<view class="item">
			<view class="item-top">
				<view class="top-status">提货商品</view>
				<view v-if="info.status === 1" class="top-status-button-ok">已确认</view>
				<view v-else-if="info.status === 10" class="top-status-button">未收到</view>
				<view v-else>
					<view v-if="!info.integral && !info.redMoney" class="top-status-button">待确认</view>
					<view v-else class="top-status-button-reward">
						<image src="https://wechat-pictures-1301970825.file.myqcloud.com/wxapp/pickup/reward.gif"
							mode=""></image>
						确认提货有奖励
					</view>
				</view>
			</view>
			<view class="goods" v-for="item in info.confirmGoodsList">
				<view class="goods-content">
					<image class="goods-img" :src="item.goodsImg"></image>
					<view class="goods-info">
						<view class="goods-title-box">
							<view class="goods-title">{{item.goodsName}}</view>
						</view>
					</view>
				</view>
				<view class="goods-z-price">
					<view class="goods-price-title">本次取货数量：</view>
					<view class="goods-price-price">{{item.pickupNumber}}</view>
				</view>
				<view class="goods-z-price">
					<view class="goods-price-title">剩余库存数量：</view>
					<view class="goods-price-price">{{item.remainPickupNumber}}</view>
				</view>
			</view>
			<view class="goods-z-price">
				<view class="goods-price-title">提货时间：</view>
				<view class="goods-price-price">{{info.createTime}}</view>
			</view>
			<view class="goods-z-price">
				<view class="goods-price-title">提货单号：</view>
				<view class="goods-price-price">{{info.customerPickupNo}}</view>
			</view>
			<reward-tip v-if="!!info.integral || !!info.redMoney" :integral='info.integral' :redMoney="info.redMoney"></reward-tip>
		</view>
		<!-- 商品详情 - end -->
		<view style="width: 750rpx;height: 120rpx;"></view>
		<!-- 底部菜单 -->
		<view v-if="info.status === 0" class="bottom-box">
			<view v-if="info.pickupType == 10" class="button-text-no" @click="closeOrder()">未收到货品</view>
			<view class="button-text" @click="submitOrder()">已收到货品</view>
		</view>
	</view>
</template>

<script>
	import RewardTip from './components/reward-tip.vue'
	export default {
		components: {
			RewardTip
		},
		data() {
			return {
				isLogined: uni.getStorageSync("token"),
				pickupNo:'',
				fromType:0, // 列表页面进入传1，默认0
				info:{
					goodsList: [
						{
							goodsImg: "",
							goodsName: "",
							goodsNo: 0,
							goodsNumber: 0,
							goodsUnit: "",
							paidinPrice: 0,
							salePrice: 0,
							unitPrice: 0
						}
					],
					qrcodeNo: "",
					tolCollectedMoney: 0,
					needInvestigate: false, // 判断是否有未答的调研问卷
				},
			}
		},
		onLoad(option) {
			if(option.fromType){
				this.fromType = option.fromType
			}
			if(option.pickupNo){
				this.pickupNo = option.pickupNo
				this.getInfo()
				this.authQuestion()
			}else{
				uni.showToast({title:'参数错误',icon:"none",duration:5000})
				return
			}
		},
		methods: {
			// 登录成功后回调
			loginSuccess(){
				this.getInfo()
			},
			// 获取订单详情
			getInfo(){
				let postData = {}
				postData.pickupNo = this.pickupNo
				postData.fromType = this.fromType
				this.$javaApiErp.doRequest("post",'/rkkt/pickuplog/customerPickupInfo?pickupNo='+this.pickupNo,postData,'json').then(res=>{
					if(res.data.code === 0){
						this.info=res.data.data
					}else{
						uni.showToast({title:res.data.message,icon:"none",duration:5000})
					}
				})
			},
			// 提交数据
			submitOrder(){
				let that = this
				let postData = {
					"pickupNo": this.pickupNo
				}
				that.$javaApiErp.doRequest("post", "/rkkt/pickuplog/customerPickupConfirm?pickupNo="+this.pickupNo, postData,'json').then(res => {
					if(res.data.code == 0){
						uni.showToast({title:'确认提货成功',icon:"success",duration:5000})
						this.info.status =1
						// 判断是否需要跳转到问卷
						if(this.needInvestigate === true){
							uni.navigateTo({
								url:'/pages/newAnswer/questionnaire',
							})
						}
					}else{
						uni.showToast({title:res.data.message,icon:"none",duration:5000})
					}
				})
			},
			// 点击未收到货品
			closeOrder(){
				let that = this
				let postData = {
					"pickupNo": this.pickupNo
				}
				that.$javaApiErp.doRequest("post", "/rkkt/pickuplog/customerPickupUnReceive?pickupNo="+this.pickupNo, postData,'json').then(res => {
					if(res.data.code == 0){
						uni.showToast({title:'操作成功',icon:"none",duration:5000})
						this.info.status =10
					}else{
						uni.showToast({title:res.data.message,icon:"none",duration:5000})
					}
				})
			},
			// 验证是否需要答题
			authQuestion() {
			  var _this = this;
			  var data = {};
			  _this.$NoteApi.doRequest("post", "investigate/needInvestigate", data).then(res => {
			    if (res.data.code == 0) {
			      if (res.data.data === 1) {
			        _this.needInvestigate = true
			      }
			      if (res.data.data !== null) {
			        _this.needInvestigate = true
			      }
			    }
			  })
			},
			// 跳转到订单成功页面
			goSuccess(payConfig) {
				uni.navigateTo({
					url:'/pages/payment/paySuccess?orderNo='+payConfig.onlineOrderNo,
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	.container{
		background-color: #ffffff;
		width: 750rpx;
		min-height: 100vh;
	}
	.top-status-button{
		color: #F59A23;
		font-size: 34rpx;
		font-weight: 500;
		text-align: center;
		width: 128rpx;
		height: 48rpx;
		line-height: 48rpx;
		background: #FFEBD1;
		border-radius: 12rpx;
	}
	.top-status-button-ok{
		color: #28B57F;
		font-size: 34rpx;
		font-weight: 500;
		text-align: center;
		width: 128rpx;
		height: 48rpx;
		line-height: 48rpx;
		background: #DFFFED;
		border-radius: 12rpx;
	}
	/* 商品 */
	.item{
		box-sizing: border-box;
		padding: 0rpx 30rpx;
		background-color: #fff;
		border-radius: 8rpx;
		padding-bottom: 40rpx;
	}
	.item-top{
		color: #666666;
		font-size: 36rpx;
		line-height: 50rpx;
		border-bottom: 2upx solid #F1F1F1;
		padding: 30rpx 24rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.goods{
		padding-bottom: 40upx;
		border-bottom: 2upx solid #F1F1F1;
	}
	.goods-content{
		width: 100%;
		display: flex;
		box-sizing: border-box;
		padding-top: 30upx;
	}
	.goods-content .goods-img{
		width: 160rpx;
		height: 160rpx;
		background: #D8D8D8;
		border-radius: 4rpx;
		margin-right: 20rpx;
	}
	.goods-info{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		flex: 1;
	}
	.goods-title-box{
	}
	.goods-title{
		font-size: 38rpx;
		color: #333333;
		font-weight: 400;
		line-height: 53rpx;
		overflow: hidden;
		max-width: 460rpx;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		display: -moz-box;
		-moz-line-clamp: 2;
		-moz-box-orient: vertical;
		overflow-wrap: break-word;
		word-break: break-all;
		white-space: normal;
		overflow: hidden;
	}
	.goods-info .goods-price{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.goods-danwei{
		font-size: 34rpx;
		color: #888888;
	}
	.goods-price-value{
		font-size: 34rpx;
		color: #333333;
	}
	.goods-num{
		text-align: end;
		font-size: 34rpx;
		color: #888888;
		padding-top: 20rpx;
	}
	.goods-z-price{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding-top: 40rpx;
	}
	.goods-price-title{
		font-size: 36rpx;
		color: #666666;
		line-height: 50rpx;
	}
	.goods-price-price{
		font-weight: 400;
		font-size: 32rpx;
		color: #333333;
		line-height: 50rpx;
	}
	.bottom-box{
		position: fixed;
		bottom: 0;
		left: 0;
		width: 750rpx;
		display: flex;
		justify-content: space-around;
		align-items: center;
		background-color: #ffffff;
		padding: 20rpx 0 50rpx 0;
	}
	.button-text{
		width: 300rpx;
		color: #ffffff;
		height: 98rpx;
		text-align: center;
		line-height: 98rpx;
		font-size: 44rpx;
		background-color: #5CAE77;
		border-radius: 14rpx;
	}
	.button-text-no{
		width: 300rpx;
		color: #ffffff;
		height: 98rpx;
		text-align: center;
		line-height: 98rpx;
		font-size: 44rpx;
		background-color: #ff5500;
		border-radius: 14rpx;
	}
	
	.top-status-button-reward {
		width: 321rpx;
		height: 50rpx;
		background: #FFD0C0;
		border-radius: 8rpx;
		position: relative;
		padding: 0 12rpx;
		box-sizing: border-box;
		text-align: right;
		line-height: 50rpx;
		font-weight: 400;
		font-size: 32rpx;
		color: #F33F02;
		font-style: normal;
	
		image {
			width: 84rpx;
			height: 84rpx;
			position: absolute;
			left: 0;
			top: -30rpx;
		}
	}
</style>
